var frmLogin = Ext.create('Ext.form.Panel', {
    id: 'formLogin',
    border: false,
    frame: false,

    //bodyStyle: 'padding:10px; background-color:#E8E8E8;',
    bodyStyle: 'background-color:#E8E8E8;',

    defaults: {
        anchor: '100%',
        selectOnFocus: true,
        enableKeyEvents: true,
        margin: 10
    },

    defaultType: 'textfield',
    items: [
        {
            xtype: 'container',
            margin: 0,
            html: '<div class="tituloWinLogin" onclick="gotoMobFacil()"><img src="../img/logo.png"/><div class="textoComSombra">MobFacil.com - Aplicativos Comerciais</div></div>'
        },
        {
            fieldLabel: 'Empresa',
            id: 'empresa',
            name: 'empresa',
            emptyText: 'Informe sua empresa',
            maxLength: 50,
            maxLengthText: 'Máximo 50 caracteres.',
            allowBlank: false,
            
            listeners: {
                keyup: function(a, b) {
                    //Executa a chamada do submit
                    Ext.getCmp('windowLogin').teclaEnter(a, b);
                }
            }
        },{
            fieldLabel: 'Usuário',
            id: 'usuario',
            name: 'usuario',
            emptyText: 'Informe seu usuário',
            maxLength: 50,
            maxLengthText: 'Máximo 50 caracteres.',
            vtype: 'email',
            allowBlank: false,
            
            listeners: {
                keyup: function(a, b) {
                    //Executa a chamada do submit
                    Ext.getCmp('windowLogin').teclaEnter(a, b);
                },
                change: function(field, newValue, oldValue){
                    field.setValue(newValue.toLowerCase());
                }
            }
        },{
            fieldLabel: 'Senha',
            id: 'senha',
            name: 'senha',
            inputType: 'password',
            emptyText: 'Informe sua senha',
            minLength: 5,
            minLengthText: 'Mínimo 5 caracteres.',
            allowBlank: false,

            listeners: {
                keyup: function(a, b) {
                    //Executa a chamada do submit
                    Ext.getCmp('windowLogin').teclaEnter(a, b);
                },
                keypress: {
                    fn: function (b, c) {
                        var a = c.getCharCode();
                        var win = Ext.getCmp('windowLogin');
                        if ((c.shiftKey && a >= 97 && a <= 122) || (!c.shiftKey && a >= 65 && a <= 90)) {
                            if(Ext.getCmp('lblCapsLock').hidden) {
                                win.setHeight(win.getHeight() + 20);
                                Ext.getCmp('lblCapsLock').show();
                            }
                        } else {
                            if(!(Ext.getCmp('lblCapsLock').hidden)) {
                                win.setHeight(win.getHeight() - 20);
                                Ext.getCmp('lblCapsLock').hide();
                            }
                        }
                    }
                }
            }
        },{
            xtype: 'label',
            id: 'lblCapsLock',
            hidden: true,
            margin: 0,
            html: '<div class="divAlerta">A tecla Caps Lock está ativada.</div>'
        }
    ]
});
